<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib prefix="p" tagdir="/WEB-INF/tags/"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<link rel="stylesheet" type="text/css" href="pageProfilCss.css" />
	<title>Votre profil</title>
</head>

<body>
	<br>
		<div id="titre">votre profil</div>
	<br>
	<script type="text/javascript">
		//<!--
		function change_profilOnglet(name) {
		document.getElementById('profilOnglet_'+anc_profilOnglet).className = 'profilOnglet_0 profilOnglet';
		document.getElementById('profilOnglet_'+name).className = 'profilOnglet_1 profilOnglet';
		document.getElementById('contenu_profilOnglet_'+anc_profilOnglet).style.display = 'none';
		document.getElementById('contenu_profilOnglet_'+name).style.display = 'block';
		anc_profilOnglet = name;
		}
		//-->
	</script>
	
	<div class="profilOnglets" style="margin-left: 50px;">
		<span class="profilOnglet_0 profilOnglet" id="profilOnglet_identite" onclick="javascript:change_profilOnglet('identite');">identité</span>
		<span class="profilOnglet_0 profilOnglet" id="profilOnglet_informations" onclick="javascript:change_profilOnglet('informations');">informations</span>
	</div>
	
	
	<form action="ModifierProfil" method="post">
	
	<div class="contenu_profilOnglets" style="margin-left: 50px;">
		<div class="contenu_profilOnglet" id="contenu_profilOnglet_identite">
			<br>
		<div style="padding-left: 40px; font-size: 11px; font-family: georgia;"><i>Informations personnelles</i></div>
			<br>
			
			
				<table>
					<tr><td valign="top">
						<div class="opacity">
							<img src="http://icons.iconarchive.com/icons/custom-icon-design/mini/16/User-icon.png">
						</div>
					</td><td valign="top">
						<libe>Nom</libe><br><br>
					</td><td valign="top">
						<input name="nom" placeholder="Votre nom" value="${user.nom}">
					</td></tr>
					
					<tr><td valign="top">
						<div class="opacity">
							<img src="http://icons.iconarchive.com/icons/custom-icon-design/mini/16/User-icon.png">
						</div>
					</td><td valign="top">
						<libe>Prénom</libe><br><br>
					</td><td valign="top">
						<input name="prenom" placeholder="Votre prénom" value="${user.prenom}">
					</td></tr>
					
					<tr><td valign="top">
						<div class="opacity">
							<img src="http://icons.iconarchive.com/icons/custom-icon-design/mini/16/Wheel-icon.png">
						</div>
					</td><td valign="top">
						<libe>Mot de passe</libe><br><br>
					</td><td valign="top">
						<input name="password" placeholder="Votre mot de passe" value="${user.password}">
					</td></tr>
					
					<tr><td valign="top">
						<div class="opacity">
							<img src="http://icons.iconarchive.com/icons/custom-icon-design/mini/16/Chat-icon.png">
						</div>
					</td><td valign="top">
						<libe>Adresse mail</libe><br><br>
					</td><td valign="top">
						<input name="email" placeholder="Votre adresse mail" value="${user.email}">
					</td></tr>
				</table>				
			
		</div>
	
		<div class="contenu_profilOnglet" id="contenu_profilOnglet_informations">
		
			<!-- <div class="cadrePhoto photoAGauche">Photo :</div> -->
			<br>
			
				<div style="padding-left: 40px; font-size: 11px; font-family: georgia;">
					<i>Informations complémentaires</i>
				</div>
				<br><br>
				
		
				<table cellspacing="0" cellpadding="0">
				
					<tr><td valign="top">
						<div class="opacity">
							<img src="http://icons.iconarchive.com/icons/custom-icon-design/mini/16/Star-empty-icon.png">
						</div>
					</td><td valign="top">
						<libe>Date de naissance</libe><br><br>
					</td><td valign="top">
						<input name="date_naissance" placeholder="Votre date de naissance" value="${user.date_naissance}">
					</td></tr>
					
					<tr><td valign="top">
						<div class="opacity">
							<img src="http://icons.iconarchive.com/icons/custom-icon-design/mini/16/Communicate-icon.png">
						</div>
					</td><td valign="top">
						<libe>Téléphone</libe><br><br>
					</td><td valign="top">
						<input name="telephone" placeholder="Votre numéro de téléphone" value="${user.telephone}">
					</td></tr>
					
					<tr><td valign="top">
						<div class="opacity">
							<img src="http://icons.iconarchive.com/icons/custom-icon-design/mini/16/Home-icon.png">
						</div>
					</td><td valign="top">
						<libe>Adresse</libe><br><br>
					</td><td valign="top">
						<input name="adresse" placeholder="Votre adresse" value="${user.adresse}">
					</td></tr>
					
					<tr><td valign="top">
						<div class="opacity">
							<img src="http://icons.iconarchive.com/icons/custom-icon-design/mini/16/Home-icon.png">
						</div>
					</td><td valign="top">
						<libe>Code Postal</libe><br><br>
					</td><td valign="top">
						<input name="cp" placeholder="Votre code postal" value="${user.code_postal}">
					</td></tr>
					
					<tr><td valign="top">
						<div class="opacity">
							<img src="http://icons.iconarchive.com/icons/custom-icon-design/mini/16/Home-icon.png">
						</div>
					</td><td valign="top">
						<libe>Ville</libe><br><br>
					</td><td valign="top">
						<input name="ville" placeholder="Votre ville" value="${user.ville}">
					</td></tr>
					
					<!--  <tr><td valign="top">
						<div class="opacity">
							<img src="http://icons.iconarchive.com/icons/custom-icon-design/mini/16/File-edit-icon.png">
						</div>
					</td><td valign="top">
						<libe>Diplome</libe><br><br>
					</td><td valign="top">
						<input name="diplome" placeholder="Votre diplome">
					</td></tr>
					
					<tr><td valign="top">
						<div class="opacity">
							<img src="http://icons.iconarchive.com/icons/custom-icon-design/mini/16/Search-icon.png">
						</div>
					</td><td valign="top">
						<libe>Présentation</libe><br><br>
					</td><td valign="top">
						<textarea rows="4" cols="50" name="presentation" >
						</textarea>
	
					</td></tr> -->
				</table>
				<br>


		</div>	
	</div>
	
		<br><div style="margin-left: 300px;"><input type="submit" value="Sauvegarder"></div>
			</form>
	
	<script type="text/javascript">
		//<!--
		var anc_profilOnglet = 'identite';
		change_profilOnglet(anc_profilOnglet);
		//-->
	</script>

</body>
</html>